import {
    getCuesActivePage,
    treeOrganization,
} from '@/services/api/api-county';
import { CheckCircleOutlined, FileImageOutlined, PaperClipOutlined } from '@ant-design/icons';
import { ModalForm, ProFormDigit } from '@ant-design/pro-form';
import ProTable, { ActionType } from '@ant-design/pro-table';
import { Space, Table, Tag, Typography, message } from 'antd';
import { DefaultOptionType } from 'antd/lib/select';
import moment from 'moment';
import React, { Ref, useEffect, useRef, useState } from 'react';
import { useAccess } from 'umi';
import { findTagColor } from '@/utils/findTagColor';
import DetailsActive from '../DetailsCounty/DetailsActive';

interface TableActiveProps {
    actionRef?: Ref<ActionType | undefined>;
    countyKey: string
}

const TableActive: React.FC<TableActiveProps> = ({countyKey }) => {
    const access = useAccess();
    const actionRef = useRef<ActionType>();

    const [organizations, setOrganizationState] = useState<any[]>([]);

    /**
     * 加载 组织 列表
     * @param key
     */
    const treeOrganizationData = async () => {
        try {
            const response = await treeOrganization({countyKey});
            if (response.code === 0) {
                setOrganizationState(response.data);
            }
        } catch (error) { }
    };

    useEffect(() => {
        //   if (access.线索上报x主动报送x配置x需求者) {
        treeOrganizationData();
        //   }
    }, []);
    useEffect(() => {
        actionRef.current?.reset()
      }, [countyKey])
    const filter = (inputValue: string, path: DefaultOptionType[]) =>
        path.some(
            (option) => (option.label as string).toLowerCase().indexOf(inputValue.toLowerCase()) > -1,
        );

    return (
        <ProTable<CuesActiveData.ActivePage>
            columns={[
              
                {
                    title: '报送线索',
                    dataIndex: 'articleName',
                    // copyable: true,
                    ellipsis: true,
                    width: '200px',
                    align: 'center',
                    key: 'articleName',
                    fixed: 'left',
                    render: (dom, record, _index, action) => {
                        return (
                            <div
                                style={{
                                    textAlign: 'left',
                                    textOverflow: 'ellipsis',
                                    whiteSpace: "nowrap",
                                    overflow: 'hidden'
                                }}
                            >
                                {record.isImage === 1 ? <FileImageOutlined /> : <></>}
                                {record.isFile === 1 ? <PaperClipOutlined /> : <></>}
                                <DetailsActive
                                    table='active'
                                    id={record.id}
                                    name={record.articleName}
                                    onRefurbish={() => {
                                        actionRef?.current?.reload();
                                    }}
                                    countyKey={countyKey}
                                />
                            </div>
                        );
                    },
                },
                {
                    title: '单位',
                    key: 'articleOrganizationTopName',
                    dataIndex: 'articleOrganizationTopName',
                    width: '180px',
                    align: 'center',
                    search: false,
                    render: (_, row) => (
                        <div
                            style={{
                                textAlign: 'left',
                                marginLeft: '24px'
                            }}
                        >
                            <Tag color={findTagColor(row.articleOrganizationTopName)}>{row.articleOrganizationTopName}</Tag>
                            {row.articleOrganizationName}
                        </div>
                    ),
                },
                {
                    title: '选题方向',
                    dataIndex: 'articleIndustryName',
                    key: 'articleIndustryName',
                    width: '80px',
                    align: 'center',
                    search: false,
                },
                {
                    title: '新闻联络人',
                    dataIndex: 'articleAccountName',
                    // copyable: true,
                    ellipsis: true,
                    search: false,
                    width: '100px',
                    align: 'center',
                    key: 'articleAccountName',
                },

                {
                    title: '创建时间',
                    dataIndex: 'createdTime',
                    key: 'createdTime',
                    width: '120px',
                    align: 'center',
                    search: false,
                },
                {
                    title: '是否录用',
                    dataIndex: 'isAdopt',
                    key: 'isAdopt',
                    valueType: 'select',
                    width: '80px',
                    align: 'center',
                    fixed: 'right',
                    // hideInTable: !access.线索上报x主动报送x选题列表x收录线索,
                    valueEnum: {
                        0: { text: '未录用' },
                        1: { text: '已录用' },
                    },
                    render: (_, record) => (
                        <Space>
                            <Tag color={record.isAdopt === 0 ? '#F9CF59' : '#1AA15F'} key="isAdopt">
                                {record.isAdopt === 0 ? '未录用' : '已录用'}
                            </Tag>
                        </Space>
                    ),
                },
                {
                    title: '评分',
                    dataIndex: 'score',
                    key: 'score',
                    width: '50px',
                    align: 'center',
                    fixed: 'right',
                    search: false,
                    // hideInTable: !access.线索上报x主动报送x选题列表x评分线索,
                },
                {
                    title: '报送日期',
                    dataIndex: 'createdTimes',
                    key: 'createdTimes',
                    valueType: 'dateRange',
                    hideInTable: true,
                    fieldProps: {
                        allowClear: true,
                        placeholder: ['开始日期', '结束日期'],
                        format: 'YYYY-MM-DD',
                        ranges: {
                            今日: [moment(), moment()],
                            本月: [moment().startOf('month'), moment().endOf('month')],
                            上月: [
                                moment().startOf('month').subtract(1, 'months'),
                                moment().endOf('month').subtract(1, 'months'),
                            ],
                            最近7天: [moment().subtract(6, 'days'), moment()],
                            最近60天: [moment().subtract(59, 'days'), moment()],
                            最近90天: [moment().subtract(89, 'days'), moment()],
                        },
                    },
                },
                {
                    title: '上报单位',
                    hideInTable: true,
                    // hideInSearch: !access.线索上报x主动报送x选题列表x收录线索,
                    key: 'organizationIds',
                    valueType: 'cascader',
                    colSize: 2,
                    fieldProps: {
                        multiple: true,
                        options: organizations,
                        showSearch: { filter },
                    },
                },
            ]}
            actionRef={actionRef}
            request={async (params = {}) => {
                if (params.organizationIds) {
                    const organizationParentIds: string[] = [];
                    let organizationIds: string[] = [];

                    params.organizationIds.forEach((item) => {
                        if (item.length === 1) {
                            organizationParentIds.push(item[0]);
                        } else if (item.length > 1) {
                            organizationIds.push(item[1]);
                        }
                    });
                    organizationParentIds.forEach((id) => {
                        const ids = organizations.find((item) => item.id === id).children;
                        organizationIds = organizationIds.concat(ids.map((item: any) => item.id));
                    });
                    params.articleOrganizationIds = organizationIds;
                }

                const response = await getCuesActivePage({...params,countyKey});

                return Promise.resolve({
                    data: response.data.data,
                    total: response.data.total,
                    success: response.code === 0,
                });
            }}
            rowKey="id"
            dateFormatter="string"
            bordered
            search={{
                defaultCollapsed: false,
                span: 8,
                labelWidth: 'auto',
            }}
            pagination={{
                showQuickJumper: true,
                showSizeChanger: true,
                defaultPageSize: 20,
            }}
        />
    );
};

export default TableActive;
